{% extends 'base.html' %}
{% load static %}

{% block title %}
    检索订单
{% endblock %}

{% block css %}
    <style>
        tr, td, th {
            text-align: center;
        }
    </style>
{% endblock %}

{% block nav %}
    <li><a href="{% url 'index' %}">数据总览</a></li>
    <li class="active"><a href="{% url 'search' %}">检索订单</a></li>
    <li><a href="{% url 'chart' %}">区域经理业绩</a></li>
    <li><a href="{% url 'predict' %}">地区业绩预测</a></li>
{% endblock %}

{% block body %}
    <div class="container">
        <div class="row">
            <div class="col-md-8 col-md-offset-2" style="height: 80px; text-align: center">
                <form class="form-inline" method="post">
                    {% csrf_token %}
                    <div class="input-group" style="height: 80px; padding-top: 23px; width: 70%">
                        <label class="sr-only" for="oid"></label>
                        <input type="text" id="oid" name="oid" class="form-control" value="{{ oid }}"
                               placeholder="请输入订单号"/>
                    </div>
                    <button type="submit" class="btn btn-primary"><span class="glyphicon glyphicon-search"></span>
                    </button>
                </form>
            </div>
            {% if order %}
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">({{ order.oid }})订单信息</div>
                        <table class="table table-hover table-striped table-bordered">
                            <thead>
                            <tr>
                                <th>订单ID</th>
                                <th>订单日期</th>
                                <th>发货日期</th>
                                <th>邮寄方式</th>
                                <th>对应客户</th>
                                <th>城市</th>
                                <th>省/自治区</th>
                                <th>国家</th>
                                <th>地区</th>
                            </tr>
                            </thead>
                            <tbody>
                            <tr>
                                <td>{{ order.oid }}</td>
                                <td>{{ order.created }}</td>
                                <td>{{ order.mail }}</td>
                                <td>{{ order.mail_type }}</td>
                                <td>({{ order.customer.cid }}) {{ order.customer.name }}</td>
                                <td>{{ order.city }}</td>
                                <td>{{ order.province }}</td>
                                <td>{{ order.nation }}</td>
                                <td>{{ order.area }}</td>
                            </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            {% endif %}

            {% if order %}
                <div class="col-md-12">
                    <div class="panel panel-info">
                        <div class="panel-heading">({{ order.oid }})订单中所包含的商品信息如下：</div>
                        <table class="table table-hover table-striped table-bordered">
                            <thead>
                            <tr>
                                <th>产品ID</th>
                                <th>类别</th>
                                <th>子类别</th>
                                <th>产品名称</th>
                                <th>销售额</th>
                                <th>数量</th>
                                <th>折扣</th>
                                <th>利润</th>
                            </tr>
                            </thead>
                            <tbody>
                            {% for product in products %}
                                <tr>
                                    <td>{{ product.pid }}</td>
                                    <td>{{ product.category }}</td>
                                    <td>{{ product.subcategory }}</td>
                                    <td>{{ product.name }}</td>
                                    <td>{{ product.revenue }}</td>
                                    <td>{{ product.quantity }}</td>
                                    <td>{{ product.discount }}</td>
                                    <td>{{ product.profit }}</td>
                                </tr>
                            {% endfor %}
                            </tbody>
                        </table>
                    </div>
                </div>
            {% endif %}

            {% if not oid %}
                <div class="col-md-12" style="text-align: center">
                    <img src="{% static 'img/无权限.png' %}" alt="没有数据" height="500">
                    <div style="font-size: 18px; font-weight: bolder">请先输入订单号</div>
                </div>
            {% endif %}
        </div>
    </div>
{% endblock %}

{% block js %}

{% endblock %}
